import React from 'react';
import { connect } from 'react-redux';
import { View, Image, Text } from '@tarojs/components';
import Taro, { useDidShow } from '@tarojs/taro';
import utils from '@/utils';
import ok from '@/images/digitalWallet/success.png';
import fail from '@/images/digitalWallet/fail.png';
import warn from '@/images/digitalWallet/warn.png';

import './index.scss';

const BindWalletResultPage = ({ dispatch, digitWallet = {}, appName }) => {
  useDidShow(() => {
    if (appName.length > 0) {
      Taro.setNavigationBarTitle({
        title: appName == 'suXiaoFu' ? '苏小福' : '',
      });
    }
  });

  const { success = false, message = '' } = digitWallet;
  let src = null,
    txt = '',
    btnTxt = '',
    handleResult = null;
  if (success) {
    src = ok;
    txt = '绑定成功';
    btnTxt = '完成';
    handleResult = () => {
      utils.goHomePage(dispatch);
    };
  } else if (message == '用户已经绑定电子钱包') {
    src = warn;
    txt = '该账号已绑定';
    btnTxt = '确定';
    handleResult = () => {
      utils.goHomePage(dispatch);
    };
  } else {
    src = fail;
    txt = '绑定失败';
    btnTxt = '重试';
    handleResult = () => {
      Taro.redirectTo({ url: '/pages/mainPages/bindWalletCode/index' });
    };
    setTimeout(() => {
      Taro.showToast({
        title: message,
        duration: 4000,
        icon: 'none',
      });
    }, 1000);
  }

  const goInfo = () => {
    Taro.navigateTo({ url: '/pages/mainPages/bindWalletUseInfo/index' });
  };

  return (
    <View className="totalPage_bindWalletResult">
      <View className="item">
        <Image className="icon" src={src}></Image>
        <Text className="text">{txt}</Text>
        <View className="btn" onClick={handleResult}>
          {btnTxt}
        </View>
      </View>
      <View className="info" onClick={goInfo}>
        <Image
          className="icon"
          src="https://ht-fine-static.oss-cn-beijing.aliyuncs.com/weapp/aNeedUp/useageEnter.jpg"
        ></Image>
      </View>
    </View>
  );
};

export default connect(({ otherApi }) => ({
  digitWallet: otherApi.digitWallet,
  appName: otherApi.appName,
}))(BindWalletResultPage);
